<template>
	<div class="weather">
		<div v-if="mode !== 'simple'">
			<h3>{{ weather.city }}</h3>
			<p>{{ weather.date }}</p>
			<p>{{ weather.weather }}</p>
			<p>
				当前气温: {{ weather.temp }}℃ <br>
				最低温度: {{ weather.l_tmp }}℃ <br>
				最高温度: {{ weather.h_tmp }}℃ <br>
			</p>
			<p>{{ weather.WD + weather.WS }}</p>
			<p>
				日出时间: {{ weather.sunrise }}
				<br>
	   		日落时间: {{ weather.sunset }}
			</p>
		</div>
		<div v-if="mode === 'simple'">
			<div>
				今日天气：
				{{ weather.city + weather.weather }}, {{ weather.l_tmp + '℃ ~' + weather.h_tmp + '℃' }}
			</div>
		</div>
	</div>
</template>

<script>
	//模拟公共 组件
	const Vue =require('vue');
	var data = {
		weather: {}
	};

	export default {
		data(){
			return new Vue({
				data: data
			});
		},
		props: [ 'mode', 'city' ],
		ready(){

			var cityname = this.city ? this.city : '北京';

			this.$http.get('/weather/' + cityname).then((response) => {

				data.weather = response.data.retData;

			}, (response) => {
				//error
				console.log(response);

			});
		}
	}
</script>